*{
    margin: 0px;
    padding: 0px;
    list-style-type: none;
}

a{
    text-decoration: none;
    color: black;
}

      /* 1、头部 */
      #head{
          width: 100%;
          height: 80px;
          background-color:#ff5f33;
          margin: 0px auto;
          text-align: center;
          /* border: 1px solid black; */
      }
      #head img{
          height: 80px;
      }
      /* 2、搜索栏 */
      #search{
          width: 100%;
          height: 50px;
         
          margin: 0px auto;
          border-bottom: 1px solid #cccccc;
      }
      #search .search1{
          width: 1080px;
          height:50px;
          margin: 0px auto;
          /* border: 1px solid blue; */
         /* display: flex; */
      }
      #search .search1 .sleft{
          width: 300px;
          height: 50px;
          text-align: left;
          float: left;
          /* border: 1px solid green; */
      }
      #search .search1 .sleft img{
          height: 50px;
      }
      #search .smiddle{
        width: 480px;
        height:50px;
        margin: auto;
        text-align: center;
        float: left;
        /* border: 1px solid rgb(38, 0, 128); */
    }
    #search .smiddle i{
        text-align: center;
        margin-top: 12px;
        font-size: 20px;
    }
    #search .smiddle .smtext1{
        width: 160px;
        height: 25px;
        border-color: red;
        text-indent: 1em;
    }
    #search .smiddle .smtext1:hover{
       border-color: grey;
    }
    #search .smiddle .smtext2{
        margin-left: 10px;
        width: 40px;
        height: 25px;
        font: 15px;
    }
    #search .search1 .sright{
        width: 290px;
        height: 50px;
        line-height: 50px;
        text-align: right;
        float: right;
        /* border: 1px solid rgb(128, 0, 85); */
    }
    #search .search1 .sright .szhuce{
        margin-top: 12px;
        color: #000000;
        font: 16px heiti;
    }
    #search .search1 .sright .sdenglu{
        background-color: #F82525;
        color: #ffffff;
        width: 40px;
        height: 25px;
        margin-left: 10px;
        border-radius: 50%;
        padding: 4px 4.5px;
    }
    #search .search1 .sright .szhuce:hover{
        color: #F82525;
    }
    #search .search1 .sright .sdenglu:hover{
        color: #000000;
    }


    #search .search1 .sright i{
        position: relative; 
        display: none;
    }
    
    #search .search1 .sright i ul{
        display: none;
      position: absolute;
      left: -10px;
      top: 15px;
        width: 100px;
        font: bolder 15px/30px  kaiti;
        text-align: center;
  z-index: 10;
  background-color: #cccccc;
    }
#search .search1 .sright i:hover ul{
        display: block;
    }
    #search .search1 .sright i ul li:hover{
        cursor: pointer;
        color: #F82525;
    }





      /* 3、内容 */
       #content{
           width: 1080px;
           height: auto;
           margin: 0px auto;
           /* border: 1px solid red; */
       }
          /* 3.1 菜单栏 */
       #content .cmenu{
           width: 100%;
           height: 35px;
           border-bottom: 1px solid #cccccc;
           margin-bottom: 5px;
           line-height: 35px;
       }
       #content .cmenu ul{
           text-align: center;
        display: flex;
        justify-content: space-between;
       }
       #content .cmenu ul li i{
           font-size: 22px;
       }
       #content .cmenu ul li{
           float: left;
       }
       #content .cmenu ul li:hover{
           color: #F82525;
           cursor: pointer;
       }
            /* 3.2轮播栏  文化头条*/
       #content .lunbo {
           width: 100%;
           height: 390px;
         
           /* border: 1px solid red; */
       }
       #content .lunbo .pic{
           width: 600px;
           height: 390px;
           float: left;
           /* 隐藏超出部分图片 */
           overflow: hidden;
           position: relative;
           /* border: 1px solid red; */
       }
       #content .lunbo .pic dd{
           width: 600px;
           height: 30px;
           background-color: rgba(0, 0, 0, 0.4);
           text-align: justify;
           color: white;
           font: 18px 方正姚体;
           position: relative;
           left: 0px;
           bottom: 25px;
       }
       #content .lunbo .pic dd:hover{
           cursor: pointer;
       }
       #content .lunbo .pic img{
        width: 600px;
        height: 390px;
       }
       #content .lunbo .pic .point{
           width: 150px;
         height: 18px;
           /* background-color: rgba(0, 0, 0, 0.6); */
            position: absolute;
            right: 0px;
            bottom: 0px;
        }
        #content .lunbo .pic .point li{
            width: 15px;
            height: 15px;
            border-radius: 50%;
            margin-left: 7.5px;
            background-color: black;
            /* 注意:如果点点浮动(右对齐)的话,点点的轮播会从右往左的顺序轮播 */
            /* 左浮动就不会出现这样的问题 */
            float: left;
        }
        /* 点点不轮播,也是刚开始没有找到问题,后来发现问题.对此,我找到了, 
        要对第一个点写一个class标签,然后对该标签写入样式,有了第一个点的显示,
        在轮播时,对点显示进行切换,js对其就可以看到效果了. */
        #content .lunbo .pic .point li.lipoint{
            background-color:rgba(255, 255, 255, 0.6);
        }
        #content .lunbo .pic .point li:hover{
            background-color: rgba(255, 255, 255, 0.6);
        }
       /* 3.22文化头条 */
       #content .lunbo .news{
           width: 450px;
           height: 390px;
           background-color: #cccccc;
           float: right;
           /* border: 1px solid black; */
       }
       #content .lunbo .news .ntop{
           width: 100%;
           height: 40px;
           background-color: #F82525;
           font: 20px weiruanyahei;
           text-align: left;
           color:white;
           margin-bottom: 20px; 
       }
       #content .lunbo .news .ntop span{
           margin-left: 20px;line-height: 40px;
       }
       #content .lunbo .news .ntop i{
            font-size: 25px;
            float: right;
            margin-right: 20px;
            line-height: 40px;

       }
       #content .lunbo .news .ntop span:hover,
       #content .lunbo .news .ntop i:hover{
           cursor: pointer;
       }
       #content .lunbo .news .nmiddle{
           width: 400px;
           height: 330px;
           text-align: center;
           font:  16px weiruanyahei;
           text-align: left;
           margin: auto;
       }
       #content .lunbo .news .nmiddle img{
           width: 400px;
           text-align: center;
       }
       #content .lunbo .news .nmiddle dd{
           margin-top: 5px;
       }

       #content .lunbo .news .nmiddle span{
          font: bolder 16px weiruanyahei;
          text-align: left;
       }
         /* 3.3 主要内容栏 文化纵览 */
         #content .smain{
             width: 100%;
             height: 0px auto;
             margin-top: 10px;
             /* border: 1px solid black; */
         }
         #content .smain .s-top{
             width: 100%;
             height: 40px;

         }
           /* 文化纵览  红色部分 */
           #content .smain .s-top{
            width: 100%;
            height: 40px;
            background-color: #F82525;
            font: 20px weiruanyahei;
            text-align: left;
            color:white;
         border: 1px solid white;
        }
        #content .smain .s-top span{
            margin-left: 30px;line-height: 40px;
        }
        #content .smain .s-top i{
             font-size: 25px;
             float: right;
             margin-right: 30px;line-height: 40px;
        }
        #content .smain .s-top span:hover,
        #content .smain .s-top i:hover{
            cursor: pointer;
        }
        /* 诸子百家 */
        #content .smain .s-item{
            width: 100%;
            height: 750px;
            background-color: #cccccc;
           
        }
        #content .smain .s-item .sneirong1{
            width: 510px;
            height: 155px;
            float: left;
            border-bottom: 2px solid #383838;
            margin-top: 20px;
            margin-left: 20px; padding-bottom: 10px;
        }
        #content .smain .s-item .sneirong2{
            width: 510px;
            height: 155px;
            float: right;
            border-bottom: 2px solid #383838;
            margin-top: 20px;
            margin-right: 20px; padding-bottom: 10px;
        }
        #content .smain .s-item .sneirong1 dl,
        #content .smain .s-item .sneirong2 dl{
            float: left;
        }
        #content .smain .s-item .sneirong1 dt img,
        #content .smain .s-item .sneirong2 dt img{
            width:250px;
            height: 155px;
            float: left;
            margin-left: 10px;
            margin-right: 10px;
            /* margin-top: 20px; */
        }
        #content .smain .s-item .sneirong1 span,
        #content .smain .s-item .sneirong2 span{
            font: bolder 18px weiruanyahei ;
        }
        #content .smain .s-item .sneirong1 span:hover,
        #content .smain .s-item .sneirong2 span:hover{
            cursor: pointer;
        }
        #content .smain .s-item .sneirong1 dd,
        #content .smain .s-item .sneirong2 dd{
            text-align: justify;
            margin-left: 5px;
            font: 15px;
        }
       /* 4、页脚 */
       #foot{
           width: 100%;
           height: auto;
           border-top: 1px solid grey;
           text-align: center;
           font: 15px;
           line-height: 25px;
           color: grey;
           margin-bottom: 20px;
       }
       #foot a{
            color: grey;
       }
       #foot a:hover{
           color: #F82525;
       }
         /* 5、置顶按钮 */
         #returntop{
             /* width: 40px;
             height: 40px; */
             font-size: 40px;
            
             position: fixed;
             right: 0px;
             bottom: 80px;
             color: grey;
             /* display: inline; */
         }
         #returntop a{
             color: grey;
         }
         #returntop i:hover{
             color: #F82525;
         }












